import { NavBar } from 'antd-mobile';
import { ReactNode } from 'react';
import styles from './index.less';

interface NavHeaderProps {
  className?: string;
  onLeftClick?: () => void;
  left?: any;
  backArrow?: boolean;
  right?: any;
  onRightClick?: () => void;
  style?: object;
  title?: ReactNode;
}

export default function NavHeader(props: NavHeaderProps) {
  return (
    <NavBar
      className={`${styles.navHeader} inbiz-ecm-navbar ${props.className}`}
      onBack={props.onLeftClick}
      back={props.left}
      backArrow={props.backArrow}
      right={<div onClick={props.onRightClick}>{props.right}</div>}
      style={props.style}
    >
      {props.title}
    </NavBar>
  );
}
